﻿<!DOCTYPE html>
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--><html lang="en"> <!--<![endif]-->
<head>

<!-- Basic Page Needs
================================================== -->
<meta charset="utf-8">
<title>Nevia</title>

<!-- Mobile Specific Metas
================================================== -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

<!-- CSS
================================================== -->
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/colors/blue.css" id="colors">

<!--[if lt IE 9]>
	<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

<!-- Java Script
================================================== -->
<script src="scripts/jquery.min.js"></script>
<script src="scripts/jquery.flexslider.js"></script>
<script src="scripts/jquery.selectnav.js"></script>
<script src="scripts/jquery.twitter.js"></script>
<script src="scripts/jquery.modernizr.js"></script>
<script src="scripts/jquery.easing.1.3.js"></script>
<script src="scripts/jquery.contact.js"></script>
<script src="scripts/jquery.isotope.min.js"></script>
<script src="scripts/jquery.jcarousel.js"></script>
<script src="scripts/jquery.fancybox.min.js"></script>
<script src="scripts/jquery.layerslider.min.js"></script>
<script src="scripts/jquery.shop.js"></script>
<script src="scripts/custom.js"></script>

</head>
<body>

<!-- Wrapper / Start -->
<div id="wrapper">

<!-- Header
================================================== -->
<div id="top-line"></div>

<!-- 960 Container -->
<div class="container">

	<!-- Header -->
	<header id="header">

		<!-- Logo -->
		<div class="ten columns">
			<div id="logo">
				<h1><a href="index.html"><img src="images/logo.png" alt="Nevia Premium Template" /></a></h1>
				<div id="tagline">Template Without Compromises!</div>
				<div class="clearfix"></div>
			</div>
		</div>

		<!-- Social / Contact -->
		<div class="six columns">

			<!-- Social Icons -->
			<ul class="social-icons">
				<li class="twitter"><a href="#">Twitter</a></li>
				<li class="facebook"><a href="#">Facebook</a></li>
				<li class="dribbble"><a href="#">Dribbble</a></li>
				<li class="linkedin"><a href="#">LinkedIn</a></li>
				<li class="rss"><a href="#">RSS</a></li>
			</ul>

			<div class="clearfix"></div>

			<!-- Contact Details -->
			<div class="contact-details">Contact Phone: +48 880 440 110</div>

			<div class="clearfix"></div>

			<!-- Search -->
			<nav class="top-search">
				<form action="404-page.html" method="get">
					<button class="search-btn"></button>
					<input class="search-field" type="text" onblur="if(this.value=='')this.value='Search';" onfocus="if(this.value=='Search')this.value='';" value="Search" />
				</form>
			</nav>

		</div>
	</header>
	<!-- Header / End -->

	<div class="clearfix"></div>

</div>
<!-- 960 Container / End -->


<!-- Navigation
================================================== -->
<nav id="navigation" class="style-1">

<div class="left-corner"></div>
<div class="right-corner"></div>

<ul class="menu" id="responsive">

	<li><a href="index.html"><i class="halflings white home"></i> Home</a></li>

	<li><a href="#" id="current"><i class="halflings white file"></i> Features</a>
		<!-- Mega Menu / Start -->
		<ul class="cols3">
			<li class="col3">
				<h4>Two Lists and a Paragraph</h4>
			</li>
			<li class="col1">
				<h5>Page Layouts</h5>
				<ol>
					<li><a href="about.html">About</a></li>
					<li><a href="flexslider.html">FlexSlider</a></li>
					<li><a href="pricing-tables.html">Pricing Tables</a></li>
					<li><a href="elements.html">Elements</a></li>
				</ol>
			</li>
			<li class="col1">
				<h5>Other Pages</h5>
				<ol>
					<li><a href="faq.html">FAQ's</a></li>
					<li><a href="404-page.html">404 Page</a></li>
					<li><a href="left-sidebar.html">Left Sidebar</a></li>
					<li><a href="right-sidebar.html">Right Sidebar</a></li>
				</ol>
			</li>
			<li class="col1">
				<h5>Paragraph</h5>
				<p>This <a href="#">Mega Menu</a> can handle everything. Lists, paragraphs, forms...</p>
			</li>
		</ul>
		<!-- Mega Menu / End -->
	</li>

	<li><a href="#"><i class="halflings white cog"></i> Shortcodes</a>
		<!-- Second Level / Start -->
		<ul>
			<li><a href="elements.html">Elements</a></li>
			<li><a href="icons.html">Icons</a></li>
			<li><a href="pricing-tables.html">Pricing Tables</a></li>
			<li><a href="typography.html">Typography</a></li>
		</ul>
		<!-- Second Level / End -->
	</li>

	<li><a href="#"><i class="halflings white briefcase"></i> Portfolio</a>
		<!-- Second Level / Start -->
		<ul>
			<li><a href="portfolio-2.html">2 Columns</a></li>
			<li><a href="portfolio-3.html">3 Columns</a></li>
			<li><a href="portfolio-4.html">4 Columns</a></li>
			<li><a href="single-project.html">Single Project</a></li>
		</ul>
		<!-- Second Level / End -->
	</li>
	
	<li><a href="#"><i class="halflings white shopping-cart"></i> Shop</a>
		<!-- Second Level / Start -->
		<ul>
			<li><a href="shop.html">Shop</a></li>
			<li><a href="product-page.html">Product Page</a></li>
		</ul>
		<!-- Second Level / End -->
	</li>

	<li><a href="#"><i class="halflings white pencil"></i> Blog</a>
		<!-- Second Level / Start -->
		<ul>
			<li><a href="blog-large-image.html">Large Image</a></li>
			<li><a href="blog-medium-image.html">Medium Image</a></li>
			<li><a href="blog-post.html">Single Post</a></li>
		</ul>
		<!-- Second Level / End -->
	</li>

	<li><a href="contact.html"><i class="halflings white envelope"></i> Contact</a></li>

</ul>
</nav>
<div class="clearfix"></div>


<!-- Content
================================================== -->
<div id="content">


<!-- 960 Container -->
<div class="container floated">

	<div class="sixteen floated page-title">

		<h2>FAQ</h2>

		<nav id="breadcrumbs">
			<ul>
				<li>You are here:</li>
				<li><a href="index.html">Home</a></li>
				<li>FAQ</li>
			</ul>
		</nav>

	</div>

</div>
<!-- 960 Container / End -->

<!-- Page Content -->
<div class="page-content">

	<!-- 960 Container -->
	<div class="container">

		<!-- Twelve Columns -->
		<div class="two-thirds column">

			<!-- Toggle 1 -->
			<div class="toggle-wrap">
				<span class="trigger opened"><a href="#"><i class="toggle-icon"></i> What is a Premium Theme? </a></span>
				<div class="toggle-container">
					<p>Perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam. Donec ut volutpat metus. Vivamus justo arcu, elementum a sollicitudin pellentesque, tincidunt ac enim. Proin id arcu ut ipsum vestibulum elementum.</p>
				</div>
			</div>

			<!-- Toggle 2 -->
			<div class="toggle-wrap">
				<span class="trigger"><a href="#"><i class="toggle-icon"></i> How much does it cost?</a></span>
				<div class="toggle-container">
					<p>Seded ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam. Donec ut volutpat metus. Aliquam tortor lorem, fringilla tempor dignissim at, pretium et arcu.</p>
				</div>
			</div>

			<!-- Toggle 3 -->
			<div class="toggle-wrap">
				<span class="trigger"><a href="#"><i class="toggle-icon"></i> Why should I purchase a Premium Theme?</a></span>
				<div class="toggle-container">
					<p>Seded ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam. Donec ut volutpat metus. Aliquam tortor lorem, fringilla tempor dignissim at, pretium et arcu.</p>
				</div>
			</div>

			<!-- Toggle 4 -->
			<div class="toggle-wrap">
				<span class="trigger"><a href="#"><i class="toggle-icon"></i> Where can I get support?</a></span>
				<div class="toggle-container">
					<p>Seded ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam. Donec ut volutpat metus. Aliquam tortor lorem, fringilla tempor dignissim at, pretium et arcu.</p>
				</div>
			</div>

			<!-- Toggle 5 -->
			<div class="toggle-wrap">
				<span class="trigger"><a href="#"><i class="toggle-icon"></i> How important is branding in a website?</a></span>
				<div class="toggle-container">
					<p>Seded ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam. Donec ut volutpat metus. Aliquam tortor lorem, fringilla tempor dignissim at, pretium et arcu.</p>
				</div>
			</div>

			<!-- Toggle 6 -->
			<div class="toggle-wrap">
				<span class="trigger"><a href="#"><i class="toggle-icon"></i> What is a User Interface?</a></span>
				<div class="toggle-container">
					<p>Seded ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam. Donec ut volutpat metus. Aliquam tortor lorem, fringilla tempor dignissim at, pretium et arcu.</p>
				</div>
			</div>

			<!-- Toggle 7 -->
			<div class="toggle-wrap">
				<span class="trigger"><a href="#"><i class="toggle-icon"></i> Why should I use Premium Theme? </a></span>
				<div class="toggle-container">
					<p>Seded ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam. Donec ut volutpat metus. Aliquam tortor lorem, fringilla tempor dignissim at, pretium et arcu.</p>
				</div>
			</div>

		</div>
		<!-- Twelve Columns / End -->


		<!-- Four Columns-->
		<div class="one-third column">
			<!-- Large Notice -->
			<div class="large-notice">
				<h2>Don't See the <br /> Answer You Need?</h2>
				<p>If you don't see the answer for your question send us a message and we will answer you as soon as possible, within a few hours.</p>
				<a href="contact.html" class="button medium color">Contact Us</a>
			</div>
		</div>
		<!-- Four / End -->



	</div>
	<!-- 960 Container / End -->

</div>
<!-- Page Content / End -->

</div>
<!-- Content / End -->

</div>
<!-- Wrapper / End -->


<!-- Footer
================================================== -->

<!-- Footer / Start -->
<footer id="footer">
	<!-- 960 Container -->
	<div class="container">

		<!-- About -->
		<div class="four columns">
			<img id="logo-footer" src="images/logo-footer.png" alt="" />
			<p>Morbi gravida imperdiet rutrum fusce mattis, lectus consequat vestibulum, duinibh fermentum ligula.</p>
		</div>

		<!-- Contact Details -->
		<div class="four columns">
			<h4>Contact Details</h4>
			<ul class="contact-details-alt">
				<li><i class="halflings white map-marker"></i> <p><strong>Address:</strong> 123 Seward Street, Oklahoma City, USA</p></li>
				<li><i class="halflings white user"></i> <p><strong>Phone:</strong> +48 880 440 110</p></li>
				<li><i class="halflings white envelope"></i> <p><strong>Email:</strong> <a href="#">mail@example.com</a></p></li>
			</ul>
		</div>

		<!-- Photo Stream -->
		<div class="four columns">
			<h4>Photo Stream</h4>
			<div class="flickr-widget">
				<script type="text/javascript" src="http://www.flickr.com/badge_code_v2.gne?count=6&amp;display=latest&amp;size=s&amp;layout=x&amp;source=user&amp;user=72179079@N00"></script>
				<div class="clearfix"></div>
			</div>
		</div>

		<!-- Twitter -->
		<div class="four columns">
			<h4>Twitter</h4>
			<ul id="twitter"></ul>
				<script type="text/javascript">
					jQuery(document).ready(function($){
					$.getJSON('http://api.twitter.com/1/statuses/user_timeline/vasterad.json?count=1&callback=?', function(tweets){
					$("#twitter").html(tz_format_twitter(tweets));
					}); });
				</script>
			<div class="clearfix"></div>
		</div>

	</div>
	<!-- 960 Container / End -->

</footer>
<!-- Footer / End -->


<!-- Footer Bottom / Start  -->
<footer id="footer-bottom">

	<!-- 960 Container -->
	<div class="container">

		<!-- Copyrights -->
		<div class="eight columns">
			<div class="copyright">
				© Copyright 2013 by <a href="#">Nevia</a>. All Rights Reserved.
			</div>
		</div>

		<!-- Menu -->
		<div class="eight columns">
			<nav id="sub-menu">
				<ul>
					<li><a href="#">FAQ's</a></li>
					<li><a href="#">Sitemap</a></li>
					<li><a href="#">Contact</a></li>
				</ul>
			</nav>
		</div>

	</div>
	<!-- 960 Container / End -->

</footer>
<!-- Footer Bottom / End -->


<!-- Style Switcher
================================================== -->
<link rel="stylesheet" href="css/switcher.css">
<script src="scripts/switcher.js"></script>

<section id="style-switcher">
	<h2>Style Switcher <a href="#"></a></h2>
	<div>
	<h3>Predefined Colors</h3>
		<ul class="colors" id="color1">
			<li><a href="#" class="blue" title="Blue"></a></li>
			<li><a href="#" class="green" title="Green"></a></li>
			<li><a href="#" class="orange" title="Orange"></a></li>
			<li><a href="#" class="navy" title="Navy"></a></li>
			<li><a href="#" class="yellow" title="Yellow"></a></li>
			<li><a href="#" class="peach" title="Peach"></a></li>
			<li><a href="#" class="beige" title="Beige"></a></li>
			<li><a href="#" class="purple" title="Purple"></a></li>
			<li><a href="#" class="red" title="Red"></a></li>
			<li><a href="#" class="pink" title="Pink"></a></li>
			<li><a href="#" class="celadon" title="Celadon"></a></li>
			<li><a href="#" class="brown" title="Brown"></a></li>
			<li><a href="#" class="cherry" title="Cherry"></a></li>
			<li><a href="#" class="gray" title="Gray"></a></li>
			<li><a href="#" class="dark" title="Dark"></a></li>
			<li><a href="#" class="cyan" title="Cyan"></a></li>
			<li><a href="#" class="olive" title="Olive"></a></li>
			<li><a href="#" class="dirty-green" title="Dirty Green"></a></li>
		</ul>

	<h3>Menu Style</h3>
	<select id="menu-style">
		<option value="1">Style 1</option>
		<option value="2">Style 2</option>
	</select>

	<h3>Background Image</h3>
		 <ul class="colors bg" id="bg">
			<li><a href="#" class="bg1"></a></li>
			<li><a href="#" class="bg2"></a></li>
			<li><a href="#" class="bg3"></a></li>
			<li><a href="#" class="bg4"></a></li>
			<li><a href="#" class="bg5"></a></li>
			<li><a href="#" class="bg6"></a></li>
			<li><a href="#" class="bg7"></a></li>
			<li><a href="#" class="bg8"></a></li>
			<li><a href="#" class="bg9"></a></li>
			<li><a href="#" class="bg10"></a></li>
			<li><a href="#" class="bg11"></a></li>
			<li><a href="#" class="bg12"></a></li>
			<li><a href="#" class="bg13"></a></li>
			<li><a href="#" class="bg14"></a></li>
			<li><a href="#" class="bg15"></a></li>
			<li><a href="#" class="bg16"></a></li>
			<li><a href="#" class="bg17"></a></li>
			<li><a href="#" class="bg18"></a></li>
		</ul>
	</div>

	<div id="reset"><a href="#" class="button color blue">Reset</a></div>

</section>
<!-- Style Switcher / End -->


</body>
</html>